//配置路由相关的信息
import VueRouter from "vue-router";
//导入插件时   需要Vue实例  所以必须导入Vue
import Vue from 'vue'

//导入(这种方式不是懒加载)
// import Home from "../components/Home";
// import About from "../components/About";
// import User from "../components/User";

//导入(懒加载方式)  实际项目中都要写懒加载的方式
const Home = () => import('../components/Home')
const About = () => import('../components/About')
const User = () => import('../components/User')

const HomeNews = () => import('../components/HomeNews')
const HomeMessage = () => import('../components/HomeMessage')


//1.通过Vue.use(插件)的方式， 安装VueRouter插件
Vue.use(VueRouter)

// 2.创建路由对象
const routes = [
  {
  path:'',
  redirect:'/home'
  },
  {
    path:'/home',
    component:Home,
    children:[
      {
        path:'',
        redirect:'news'
      },
      {
        path:'news',
        component:HomeNews,
      },
      {
        path:'message',
        component:HomeMessage,
      }
    ]
  },
  {
    path:'/about',
    component:About
  },
  {
    path:'/user/:userid',
    component:User
  }
]

const router = new VueRouter({
  //配置路径和组件之间的路径关系
  routes,
  mode:'history'
})

//3.将router传入到vue实例中
export default router
